<template>
	<view class="forget">

		<view class="content">
			<!-- 主体 -->
			<view class="main">
				<view class="tips">若你忘记了密码，可在此重置新密码。</view>
				<wInput v-model="username" type="text" placeholder="请输入您的账号"></wInput>
				<wInput v-model="password" type="password" placeholder="请输入新密码" isShowPass></wInput>

				<wInput v-model="verCode" type="number" placeholder="验证码" isShowCode codeText="获取验证码" setTime="60" ref="runCode" @setCode="getVerCode()"></wInput>
			</view>

			<wButton class="wbutton" text="重置密码" :rotate="isRotate" @click.native="startRePass()"></wButton>

		</view>
	</view>
</template>

<script>
let _this;
import wInput from '../../components/watch-login/watch-input.vue' //input
import wButton from '../../components/watch-login/watch-button.vue' //button
export default {
	data() {
		return {
			username: "", //电话
			password: "", //密码
			verCode: "", //验证码
			isRotate: false, //是否加载旋转
		}
	},
	components: {
		wInput,
		wButton
	},
	mounted() {
		_this = this;
	},
	methods: {
		getVerCode() {
			//获取验证码
			if (_this.username == '') {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '请输入用户名'
				});
				return false;
			}
			console.log("获取验证码")
			//触发倒计时（一般用于请求成功验证码后调用）
			this.loading = true;
			this.$api.get_email_verification_code({
				username: this.username,
				type: 2
			}).then((res) => {
				this.loading = false;
				console.log(res);
				if (res.code == 1) {
					this.$refs.runCode.$emit('runCode');
					uni.showToast({
						icon: 'success',
						position: 'bottom',
						title: res.msg
					});
				} else {
					uni.showToast({
						icon: 'error',
						position: 'bottom',
						title: res.msg
					});
				}
				uni.hideLoading();
			}).catch((err) => {
				this.loading = false;
				uni.showToast({
					icon: 'error',
					position: 'bottom',
					title: "系统错误，请稍后再试"
				});
				uni.hideLoading();
			})
		},
		startRePass() {
			//重置密码
			if (this.isRotate) {
				//判断是否加载中，避免重复点击请求
				return false;
			}
			if (this.phoneData == '') {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '请输入用户名'
				});
				return false;
			}
			if (this.password.length < 6) {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '密码长度不能小于6位'
				});
				return false;
			}
			if (this.verCode.length == '') {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '请输入验证码'
				});
				return false;
			}
			_this.isRotate = true
			this.$api.retrieve_password({
				username: this.username,
				password: this.password,
				captcha: this.verCode,
				type: 1
			}).then((res) => {
				this.loading = false;
				_this.isRotate = false
				if (res.code == 1) {
					uni.showToast({
						icon: 'success',
						position: 'bottom',
						title: '修改密码成功'
					});
					_this.$refs.runCode.$emit('runCode', 0);
					uni.reLaunch({
						url: '/pages/login/login',
					});
				}
				uni.hideLoading();
			}).catch((err) => {
				this.loading = false;
				uni.showToast({
					icon: 'error',
					position: 'bottom',
					title: "系统错误，请稍后再试"
				});
				uni.hideLoading();
			})


		}
	}
}
</script>

<style>
@import url("../../components/watch-login/css/icon.css");
@import url("./css/main.css");
</style>

